<!DOCTYPE html>
<html   xmlns="http://www.w3c.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:p="http://primefaces.org/ui"
        xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head/>
    <h:body>
        <h:outputText value="Does not work..."/>
        
        <h:form>
         
            <h:panelGrid columns="2" cellpadding="10">
                <p:outputLabel for="basic" value="Basic:" />
                <p:themeSwitcher id="basic" style="width:165px">
                    <f:selectItem itemLabel="Choose Theme" itemValue="" />
                    <f:selectItems value="[afterdark, afternoon, afterwork, aristo, black-tie, blitzer, bluesky, bootstrap, casablanca, cupertino, cruze, dark-hive, delta, dot-luv, eggplant, excite-bike, flick, glass-x, home, hot-sneaks, humanity, le-frog, metroui, midnight, mint-choc, overcast, pepper-grinder, redmond, rocket, sam, smoothness, south-street, start, sunny, swanky-purse, trontastic, ui-darkness, ui-lightness, vader]" var="theme" itemLabel="" itemValue=""/>
                </p:themeSwitcher>

                <p:outputLabel for="advanced" value="Advanced:" />
                <p:themeSwitcher id="advanced" style="width:165px" effect="fade" var="t">
                    <f:selectItem itemLabel="Choose Theme" itemValue="" />
                    <f:selectItems value="[afterdark, afternoon, afterwork, aristo, black-tie, blitzer, bluesky, bootstrap, casablanca, cupertino, cruze, dark-hive, delta, dot-luv, eggplant, excite-bike, flick, glass-x, home, hot-sneaks, humanity, le-frog, metroui, midnight, mint-choc, overcast, pepper-grinder, redmond, rocket, sam, smoothness, south-street, start, sunny, swanky-purse, trontastic, ui-darkness, ui-lightness, vader]" var="theme" itemLabel="" itemValue="" />

                    <p:column>
                        <h:outputText styleClass="ui-theme ui-theme-" style="display-block" />
                    </p:column>

                    <p:column>

                    </p:column>
                </p:themeSwitcher>
            </h:panelGrid>

            <p:separator />

            <p:dialog header="Dialog" widgetVar="dlg" minHeight="40" modal="true">
                <h:outputText value="Resistance to PrimeFaces is futile!" />
            </p:dialog>  

            <p:commandButton value="Dialog" onclick="PF('dlg').show()" type="button" style="display:block;"/>

            <p:panel header="Panel" style="margin:20px 0px">
                Panel Content
            </p:panel>

            <p:spinner />

            <p:toolbar style="margin:20px 0px">
                <f:facet name="left">
                    <p:commandButton type="button" value="New" icon="ui-icon-document" />
                    <p:commandButton type="button" value="Open" icon="ui-icon-folder-open"/>
                    <p:commandButton type="button" title="Save" icon="ui-icon-disk"/>
                    <p:commandButton type="button" title="Delete" icon="ui-icon-trash"/>
                    <p:commandButton type="button" title="Print" icon="ui-icon-print"/>
                </f:facet>

                <f:facet name="right">
                    <p:menuButton value="Navigate">
                        <p:menuitem value="Home" url="http://www.primefaces.org" />
                        <p:menuitem value="ShowCase" url="http://www.primefaces.org/showcase" />
                        <p:menuitem value="TouchFaces" url="http://www.primefaces.org/showcase/touch" />
                    </p:menuButton>
                </f:facet>
            </p:toolbar>

            <p:accordionPanel>
                <p:tab title="Tab1">Tab1 Content</p:tab>
                <p:tab title="Tab2">Tab2 Content</p:tab>
                <p:tab title="Tab3">Tab3 Content</p:tab>
            </p:accordionPanel>

        </h:form>
    </h:body>
</html>
